{% extends 'wancake/base_nav_frame.html' %}
{% load staticfiles %}
{% block content %}
  <div>
    <div class="row">
      <div class="container">
        <ol class="breadcrumb wb-breakcrumb">
          <li><a href="#">资源管理</a> </li>
          <li class="active">添加分组</li>
        </ol>
      </div>
    </div>
    <div class="row">
      <div class="container col-lg-6 col-sm-6 col-md-6 col-xs-6">
        <form class="form-horizontal" method="post">
          <div class="form-group wb-form-field-group">
            <label for="wb-group" class="col-md-offset-1 col-lg-offset-1 col-sm-offset-1 col-xs-offset-1 col-sm-2 col-lg-2 col-md-2 col-xs-2 control-label">分组:</label>
            <div class="col-sm-6 col-lg-6 col-md-6 col-xs-6">
              <input type="text" class="form-control wb-form-control" id="wb-group" name="group-name" placeholder="请输入分组名称" />
            </div>
            <div class="col-md-1 col-lg-1 col-sm-1 col-xs-1">
              <span class="glyphicon form-control-feedback" aria-hidden="true" data-rel-field="wb-group"></span>
            </div>
          </div>
          <div class="col-sm-6 col-xs-6 col-md-6 col-lg-6 col-lg-offset-3 col-md-offset-3 col-sm-offset-3 col-xs-offset-3 wb-form-field-button-block wb-form-field-group">
            <button type="submit" class="btn btn-success btn-block" id="wb-submit-group">添加分组</button>
            <div class="clearfix"></div>
          </div>
          <div class="col-sm-6 col-xs-6 col-md-6 col-lg-6 col-lg-offset-3 col-md-offset-3 col-sm-offset-3 col-xs-offset-3">
            <p class="text-danger" id="wb-add-group-result-hint">
            </p>
          </div>
        </form>
      </div>
    </div>
  </div>
{% endblock %}
{% block jsscript %}
  <script type="text/javascript">
    $(document).ready(function(e) {
      $("#wb-add-group-result-hint").hide();

      $("#wb-submit-group").click(function(e) {
        $.ajax("./add/done", {
          data : {
            "group-name": $("input[name=\"group-name\"]").val()
          }
          , type: "POST"
          , dataType: "json"
          , success : function(data) {
            var resultHint = $("#wb-add-group-result-hint");
            resultHint.show();
            if (data.resultCode == 1) {
              resultHint.removeClass("text-danger")
                  .addClass("text-success");
              resultHint.html("<span class=\"glyphicon glyphicon-ok-sign wb-icon-space-right\"></span>" + data.message);
            } else {
              resultHint.removeClass("text-success")
                  .addClass("text-danger");
              resultHint.html("<span class=\"glyphicon glyphicon-remove-sign wb-icon-space-right\"></span>" + data.message);
            }
          }, error : function() {
          }
        });
        e.preventDefault();

      });

    });
  </script>
{% endblock %}